<template>
  <el-dialog
    v-dialogDrag
    title="提示"
    :visible="isViewPopWindowsAdd"
    width="60%"
    @open="query"
    @close="closed"
    :append-to-body="true"
    :close-on-click-modal="false"
    center
    ref="isPopWindows"
  >
    <dialogHeader
      slot="title"
      title="添加备件"
      :style-type="$store.state.app.dialogType"
    />
    <div class="formBoxContain">
      <!--
            buttons: 按钮
            froms: 表单
            fromsField: 表单对应的字段
            tableOption: 网格项
            dynamicApiConfigs: 取值
         -->

      <one-table-template
        ref="multipleTable"
        :dynamic-buttons="tableButtons"
        :dynamic-components="tableComponents"
        :dynamic-form-fields="formField"
        :dynamic-table-cols="tableCols"
        :dynamic-is-show-select="true"
        :dynamic-table-defult-height="400"
        :dynamic-is-show-more-btn="true"
        :dynamic-page-size="30"
        :dynamic-is-init-table="true"
        :dynamic-api-config="apiConfig"
        :isShowPagination="true"
        :callbackObj="callbackObj"
      />
    </div>
  </el-dialog>
</template>

<script>
import dialogHeader from "@/components/dialogHeader";
import OneTableTemplate from "@/components/templates/oneTable";
import api from "@/api/vehicleManagement";
import { vehiclePdiPriceInquirys } from "@/api/se/vehiclePdiPriceInquiry";
import { exportExcel } from "@/utils/getTimeString.js";
import { resetRouter } from '@/router';

export default {
  components: {
    dialogHeader,
    OneTableTemplate,
  },
  props: {
    chosenList: {
      type: Array,
      default: () => ([])
    },
    // 是否关闭弹窗
    dynamicEditRowData: {
      type: Object,
      default: function () {
        return {};
      },
    },
  },
  data() {
    // 页面标识（与上面beforeRouteEnter中的对应）
    const viewPageCode = this.$route.path;
    
    // 绑定事件配置化事件
    this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode]);
    return {
      apiConfig: vehiclePdiPriceInquirys.findDlrOutStorage,
      isViewPopWindowsAdd : false,
      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
              .tableComponents
          : [
              {
                compKey: "compKey1",
                labelName: "备件编码:",
                codeField: "partNo",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMust: true,
                span: 8,
              },

              {
                compKey: "compKey3",
                labelName: "备件名称：",
                codeField: "partName",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMul: false,
                isMust: true,
                span: 8,
              },

              {
                compKey: "compKey4",
                labelName: "最新有效出库时间：",
                codeField: "lastOutdate",
                component: () => import("@/components/org/datePicker/twoDatePicker.vue"),
                type: "twoDatePicker",
                isMul: false,
                isMust: true,
                span: 8,
              },
            ],
      formField: this.$utils.getFormField(this, {
        partNo: "",
        partName: "",
        lastOutdate: "",
      }),
      selectiondata: [],
      // 回调方法对象
      callbackObj: {
        // 网格点击回调事件
        onRowClick: (currentRow) => {
          // this.onRightRowClick(currentRow);
        },
        // 手动勾选网格时，拿到勾选网格的数据
        onCheckSelect: (selection, row) => {
          this.selectiondata = selection;
        },
        onCheckSelectChange: (selection) => {
          // this.onCheckSelectChange1(selection)
          this.selectiondata = selection;
        },
        onSelectable: (row) => {
          return !this.chosenList.includes(row.partId)
        }
      },

      // 动态组件-按钮
      tableButtons: [
        {
          compKey: "button1",
          type: "primary",
          size: "small",
          name: "",
          clickEvent: () => this.$refs['multipleTable'].queryTable(),
          text: "查询",
          position: "right",
        },
        {
          compKey: "button1",
          type: "primary",
          size: "small",
          name: "",
          clickEvent: () => this.submit(),
          text: "提交",
          position: "right",
        },
        {
          compKey: "button1",
          type: "primary",
          size: "small",
          name: "",
          clickEvent: () => {
            for (const attr in this.formField) {
              this.formField[attr] = ''
            }
          },
          text: "重置",
          position: "right",
        },
      ],
      // 动态生成网格列
      tableCols:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          : [
              {
                prop: "partNo",
                label: "备件编码",
                align: "center",
              },
              {
                prop: "partName",
                label: "备件名称",
                align: "center",
              },
              {
                prop: "pointPriceTax",
                label: "单价",
                align: "center",
              },
              {
                prop: "unit",
                label: "单位",
                align: "center",
              },
              {
                prop: "accountQty",
                label: "账面库存",
                align: "center",
              },
              {
                prop: "frozenQty",
                label: "冻结库存",
                align: "center",
              },
              {
                prop: "badProductsQty",
                label: "不良品数",
                align: "center",
              },
              {
                prop: "lastOutdate",
                label: "最新有效出库时间",
                align: "center",
              },
            ],
    };
  },
  methods: {
    /**
     * @description 关闭弹窗
     * @time 2021、01、22
     */
    closed() {
      this.isViewPopWindowsAdd = false;
    },
    query() {
      const queryObj = {
        // api配置
        apiConfig: vehiclePdiPriceInquirys.findDlrOutStorage,
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: this.formField,
      };
      // 转换了中台请求格式数据
      var paramD = this.$getParams(queryObj);
      // 调用中台API方法（可复用）
      this.$requestAPI(paramD).then((response) => {
        this.$refs.multipleTable.list = response.rows;
      });
    },
    submit() {
      if(!this.selectiondata || this.selectiondata.length == 0) {
         this.$message({
            message: "请至少选择一条数据",
            type: "warn",
            uration: 2000,
          });
          return
      }
      this.$emit("selectiondata", this.selectiondata);
      this.isViewPopWindowsAdd = false;
    },
  },
};
</script>
<style scoped>

</style>
